<%@ page language="java" contentType="text/html; charset=UTf-8"
    pageEncoding="UTf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/ui.css" rel="stylesheet"/>
<link href="css/payment_succeeded.css" rel="stylesheet" />
<link href="css/framework.css" rel="stylesheet"/>
<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
<title>Payment Succeeded</title>
</head>
<body>
    <div id="header">
        <img id="imgLogo" style="margin-left: 10px" src="images/bookstore_logo.png"/>
    </div>
    <div id="content">
    	<h3><img width='60px' height='60px' src='images/successIcon.png'>Payment Succeeded!</h3>
 		(Automatically return to the <a href='customer.jsp'>home</a> page after <span id="totalSecond" style="font-size:18px;color:red;font-weight:bolder;">5</span> seconds.)
    </div>
    <div id="footer" align="center">
            <p style="font-size: 13px; color: lightgray;">
                © 2018 Qweas Bookstore, Zhang Wenqiang, Wu Jiatian, Ethan Phung, Andrew Lu and Eric Shuai. All rights reserved.</p>
        </div>
</body>
<script language="javascript" type="text/javascript">   
    var second = document.getElementById('totalSecond').innerText; 
    setInterval("redirect()", 1000);
    function redirect()  
    {  
        if (second < 0)  
        {  
            location.href = 'customer.jsp';  
        }
        else  
        {    
            document.getElementById('totalSecond').innerText = second--;  
        }  
    }   
</script> 
</html>